<template>
    <!--<el-dialog title="教师详情" v-model="teacherDeailVisible" :close-on-click-modal="false">-->
    <!---->
    <div>
        <table class="border-table">
                <tr>
                    <td class="spec alt">学生姓名</td>
                    <td>{{teacherDeail.stuName}}</td>
                    <td class="alt">学生相片</td>
                    <td>
                        <img :src="teacherDeail.stuPicture" class="avatar">
                    </td>

                </tr>
                <tr>
                    <td class="spec alt">姓名</td>
                    <td>{{teacherDeail.stuName}}</td>
                    <td class="alt">升学类型</td>
                    <td>{{teacherDeail.stuType}}</td>
                </tr>
                <tr>
                    <td class="spec alt">民族</td>
                    <td>{{teacherDeail.stuNation}}</td>
                    <td class="alt">身份证</td>
                    <td>{{teacherDeail.stuIdcard}}</td>
                </tr>
                <tr>
                    <td class="spec alt">性别</td>
                    <td>{{teacherDeail.stuSex}}</td>
                    <td class="alt">手机号</td>
                    <td>{{teacherDeail.stuPhone}}</td>
                </tr>

                <tr>
                    <td class="spec alt">家庭住址</td>
                    <td>{{teacherDeail.stuHomeAddress}}</td>
                    <td class="alt">学历</td>
                    <td>{{teacherDeail.stuEducation}}</td>
                </tr>
            </table>
        </div>
    <!--</el-dialog>-->
</template>
<script>
    import{getPrint} from '../../api/api'

    export default{
        data(){
            return {
//                teacherDeailVisible: false,

                teacherDeail: {
                    stuId: '',
                    stuName: '',
                    stuSex: '',
                    stuNation: '',
                    stuType: '',
                    stuPhone: '',
                    stuIdcard:'',
                    stuPicture:'',
                    stuHomeAddress:'',
                    stuEducation:''
            },
            }
        },
        methods: {
            getData(){
                let para = {};
                getPrint(para).then((res) => {
                    console.log(res.resData);
//                    //如果后台发返回的时list集合就用
//                    this.teacherDeail=res.resData[0];
                    //如果后台发返回的是对象就用
                    this.teacherDeail=res.resData;

                });
            }
        },
        mounted() {
            this.getData();
        }
    };
</script>

<style scoped>
    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #20a0ff;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 50px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }

    .avatar {
        width: 150px;
        height: 150px;
        display: block;
    }

    .border-table {
        border-collapse: collapse;
        border: none;
        width: 800px;
        height: 200px;
    }

    .border-table td {
        border: solid #dfe8ec 1px;
        background:#fff;
        font-size: 14px;
        padding: 6px 6px 6px 12px;
        color: #009966;
        text-align: center;
        line-height: 28px;
    }
    td.alt {
        background: #EFF2F7;
        color: #8492A6;
    }
</style>
